<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> <Somnus:sitecfg name="sitetitle"/> </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="description" content=" <Somnus:sitecfg name="sitedescription"/> ">
<meta name="Keywords" content=" <Somnus:sitecfg name="sitekeywords"/> ">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/mui.min.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/mui.picker.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/mui.poppicker.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/newpay-bb7fcb5546.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/feiqi-ee5401a8e6.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/pay-2b02ca7987.css">
<style>
	.mui-input-group .mui-input-row, .mui-input-row{
	    height: 45px;
		padding-right: 10px;
	}
	.marea{padding-right: 15px;}
	.regfrm label {
	    padding: 14px 15px;
	}
	.marea label {
	    padding: 14px 0;
	}
	.mui-input-row label~input, .mui-input-row label~select, .mui-input-row label~textarea {
	    height: 45px;
	    text-align: right;
	}
	.mui-input-row:last-child:after{
    height: 0;
	}
	@media screen and (max-width: 321px){
		.marea label {
		    font-size: 14px;
		    width: 24%;
		    padding-top: 15px;
		}
		.marea label~input {
		    width: 76%;
		}
		.regfrm .mui-input-row label {
		    width: 24%;
		    white-space: nowrap;
		    font-size: 14px;
		    padding: 15px 15px;
		}
		.regfrm .mui-input-row input {
		    font-size: 14px;
		    width: 74%;
		}			
	}
	@media screen and (max-width: 350px){
		.marea label~input {
	        font-size: 13px;			   
		}
	}
	.seltarr {
	    display: block;
	    position: absolute;
	    top: 20px;
	    right: 10px;
	}
	
	.sfz_box{ background:#fff; padding:5px 2px; height:137px;}
	.sfz_box:after{ content:''; clear:both;}
</style>
</head>
<body class="newbg">
 	<!-- header -->
 	<header class="mui-bar mui-bar-nav hnav">
		<a class="back" href="javascript:history.go(-1)"></a>
		<h1 class="mui-title">手持证件照片</h1>
	</header>
	<!-- header end-->
<div class="mui-content">
	<!-- paymoney -->
	<article class="tipinfo">		
    <notempty name="userinfo">
		您的信息已经审核！
        <else />
        填写真实有效的信息，审核才会通过哦~
    </notempty>
	</article>
	
	
	<article class="tipinfo">
		<p>*須本人身份證，且内容清晰可辨</p>
		<p>*請您确認拍照權限已開啓</p>
	</article>
	<div class="mui-input-group regfrm">
    <section> 


	   <!-- 证件 -->	
			<!-- pho -->
        <div class="sfz_box">
				<div class="sfzwrap prel">
		   			<div class="phoes" id="mode1" class="uploader-list">
		   				<input type="hidden" id="sfz_zm" />
			   				<div class="sfzp" id="sfz_zm_div">
				   				<img src="<?php if($userinfo.cardphoto_1){echo $userinfo.cardphoto_1;}else{ echo '__PUBLIC__/home/imgs/uppic1.png';}?>" alt="" / >
				   			</div>
				   			<div style="display:none;">
				   				<!-- <input type="file" id="sfz_zm_input" onChange="uploadImg('sfz_zm','sfz_zm_div',this);" /> -->
				   				<input type="file" class='photo_input' accept="image/*" id="sfz_zm_input" />
				   			</div>
						<div class="hcamera pab" onClick="Selfile('sfz_zm_input');">
							<img src="__PUBLIC__/home/imgs/hcamera.png" alt="">
						</div>
						<div class="sfztip pab">身份證正面照</div>
				 	</div>	
				</div>
			   	<!-- pho -->



				   	 <!-- pho -->
				   		<div class="sfzwrap prel">
				   			<div class="phoes" id="mode2" class="uploader-list">
				   				<input type="hidden" id="sfz_fm" />
					   			<div class="sfzp" id="sfz_fm_div">
					   				<img src="<?php if($userinfo.cardphoto_2){echo $userinfo.cardphoto_1;}else{ echo '__PUBLIC__/home/imgs/uppic2.png';}?>" alt="" />
					   			</div>
					   			<div style="display:none;">
					   				<!-- <input type="file" id="sfz_fm_input" onChange="uploadImg('sfz_fm','sfz_fm_div',this);" /> -->
					   				<input type="file" class='photo_input' accept="image/*" id="sfz_fm_input" />
					   			</div>
							   	<div class="hcamera pab" onClick="Selfile('sfz_fm_input');">
							   		<img src="__PUBLIC__/home/imgs/hcamera.png" alt="">
							   	</div>
							   	<div class="sfztip pab">身份證反面照</div>
						   	</div>
				   		</div>
            </div>
	   	<!-- pho -->
		   <!-- 证件 end-->
		   <!-- 证件 -->
		   	<!-- pho -->
            <div class="sfz_box">

			   		<div class="sfzwrap prel h130">
			   			<div class="phoes" id="mode3" class="uploader-list">
			   				<input type="hidden" id="txz_zm" />
				   			<div class="sfzp"  id="txz_zm_div">
				   				<img src="<?php if($userinfo.cardphoto_3){echo $userinfo.cardphoto_1;}else{ echo '__PUBLIC__/home/imgs/uppic3.png';}?>" alt="" />
				   			</div>
				   			<div style="display:none;">
				   				<!-- <input type="file" id="sfz_sc_input" onChange="uploadImg('sfz_sc','sfz_sc_div',this);" /> -->
				   				<input type="file" class='photo_input' accept="image/*" id="txz_zm_input" />
				   			</div>
				   			<div class="hcamera pab" onClick="Selfile('txz_zm_input');">
				   			 	<img src="__PUBLIC__/home/imgs/hcamera.png" alt="">
				   			</div>
				   			<div class="sfztip pab">通行證正面照</div>
			   			</div>

	              </div>

	             <div class="sfzwrap prel h130">
		   			<div class="phoes" id="mode3" class="uploader-list">
		   				<input type="hidden" id="txz_fm" />
			   			<div class="sfzp"  id="txz_fm_div">
			   				<img src="<?php if($userinfo.cardphoto_4){echo $userinfo.cardphoto_1;}else{ echo '__PUBLIC__/home/imgs/uppic4.png';}?>" alt="" />
			   			</div>
			   			<div style="display:none;">
			   				<!-- <input type="file" id="sfz_sc_input" onChange="uploadImg('sfz_sc','sfz_sc_div',this);" /> -->
			   				<input type="file" class='photo_input' accept="image/*" id="txz_fm_input" />
			   			</div>
			   			<div class="hcamera pab" onClick="Selfile('txz_fm_input');">
			   			 	<img src="__PUBLIC__/home/imgs/hcamera.png" alt="">
			   			</div>
			   			<div class="sfztip pab">通行證反面照</div>
		   			</div>
	                
		   	     </div>
			   	<!-- pho -->
			   <!-- 证件 end-->
		 </div>






	</article>
	</section>
	</div>
	<section class="msub" style="position: relative;">
		<button type="button" class="mui-btn mui-btn-danger mui-button-pay mui-button-gry" onClick="saveInfo();">下壹步</button>
		<!-- 提示 -->
		<div style="display: none;position: absolute;" class="errdeo" id="messageBox">
		</div>	
	</section>
</div>
<script src="__PUBLIC__/home/js/jquery-1-fe84a54bc0.11.1.min.js"></script>
<script src="__PUBLIC__/home/js/stuCheck-ae09551939.js"></script>
<script src="__PUBLIC__/home/js/geihuaCom-1088667498.js"></script>
<script src="__PUBLIC__/home/js/mui.min.js"></script>
<script src="__PUBLIC__/home/js/lrz.all.bundle.js"></script>
<script src="__PUBLIC__/home/js/mui-bd98b45634.picker.js"></script>
<script src="__PUBLIC__/home/js/mui-9fb36284ae.poppicker.js"></script>
<script src="__PUBLIC__/home/js/city-564994092a.data.js" type="text/javascript" charset="utf-8"></script>
<script src="__PUBLIC__/home/js/city-67f8c196d0.data-3.js" type="text/javascript" charset="utf-8"></script>
<script>
var isupload = false;
//判断如果已经上传了图片就显示
var sfz_zm = "{$userinfo.cardphoto_1}";
var sfz_fm = "{$userinfo.cardphoto_2}";
var txz_zm= "{$userinfo.cardphoto_3}";
var txz_fm= "{$userinfo.cardphoto_4}";


if(sfz_zm != ''){
	$("#sfz_zm").val(sfz_zm);
	$("#sfz_zm_div").html('<img src="'+sfz_zm+'">');
}
if(sfz_fm != ''){
	$("#sfz_fm").val(sfz_fm);
	$("#sfz_fm_div").html('<img src="'+sfz_fm+'">');
}
if(txz_zm != ''){
	$("#txz_zm").val(txz_zm);
	$("#txz_zm_div").html('<img src="'+txz_zm+'">');
}
if(txz_fm != ''){
	$("#txz_fm").val(txz_fm);
	$("#txz_fm_div").html('<img src="'+txz_fm+'">');
}






$('#sel').change(function(){
	change('sel','sela')
});
$('.inputblur').click(function(){
	$(this).blur();
	$('.nofocus').blur();
});

function showalert(msg){
	$("#messageBox").html(msg);
	$("#messageBox").show();
	setTimeout(function(){
		$("#messageBox").hide();
	},2000);
}
function Selfile(inputid){
	if(isupload != false){
		showalert("其他文件正在上傳...請稍後");
	}else{
		$("#"+inputid).click();
	}
}
function base(base64){
	console.log(base64);
}

$(".photo_input").each(function(){
	var that = this;
	$(this).change(function(){
		lrz(this.files[0])
        .then(function (rst) {
            $.ajax({
	            url:"__PUBLIC__/main/js/kindeditor/php/upload_json.php",
	            type:"post",
	            dataType:'json',
	            data: rst.formData,
	            cache: false,
	            contentType: false,
	            processData: false,
	            success:function(data){
	            	console.log(data);
	                if(data && data.error == '0'){
	              		showalert("上傳成功");
	                    var imgurl = data.url;
	                    $(that).parent().prev().html('<img src="'+imgurl+'">');
	                    $(that).parent().siblings('input').val(imgurl);
	                }else{
	                	showalert(data.error);
	                }
	            },
	            error:function (data){
					showalert(data.error);
	            }
	        });
        })
        .catch(function (err) {
            // 处理失败会执行
            alert(err);
        })
        .always(function () {
            // 不管是成功失败，都会执行
        });
	});
});

function checkval(val_){
	if(val_ == '' || val_ == null){
		return false;
	}else{
		return true;
	}
}

//保存资料
function saveInfo(){

	var cardphoto_1 = $("#sfz_zm").val();
	var cardphoto_2 = $("#sfz_fm").val();
	var cardphoto_3 = $("#txz_zm").val();
	var cardphoto_4 = $("#txz_fm").val();


	if(checkval(cardphoto_1) && checkval(cardphoto_2) && checkval(cardphoto_3)){
		$.post(
			"{:U('Info/sczpinfo')}",
			{

				cardphoto_1:cardphoto_1,
				cardphoto_2:cardphoto_2,
				cardphoto_3:cardphoto_3,
				cardphoto_4:cardphoto_4
			},
			function (data,state){
				if(state != "success"){
					showalert("請求數據失敗,請重試!");
				}else if(data.status == 1){
					showalert("保存成功!");
					window.location.href = "{:U('Info/lxedinfo')}";
				}else{
					showalert(data.msg);
				}
			}
		);
	}else{
		showalert("資料填寫不完整,請檢查!");
	}
}


</script>
<div style="display: none;">
	<Somnus:sitecfg name="sitecode"/>
</div>
</body>
</html>